<template>
  <div class="customer-service">
    <p class="title">客户服务</p>
    <div class="search-box">
      <input type="text" placeholder="搜索信息">
      <p class="btn">
        <van-icon name="search" size="28px" color="#fff"/>
      </p>
    </div>
    <div class="list-box">
      <p class="list">
        <span>完整填写退货申请</span>
        <van-icon name="arrow" size="20px" color="#616161"/>
      </p>
      <p class="list">
        <span>跟踪您的订单</span>
        <van-icon name="arrow" size="20px" color="#616161"/>
      </p>
      <p class="list">
        <span>跟踪您的退货</span>
        <van-icon name="arrow" size="20px" color="#616161"/>
      </p>
    </div>
    <div class="list-box box">
      <p class="list">购物</p>
      <p class="list">尺码对照表</p>
      <p class="list">我的账户</p>
      <p class="list">配送信息</p>
      <p class="list">付款方式</p>
      <p class="list">COVID-19常见问题</p>
      <p class="list">电子邮件</p>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.customer-service {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden scroll;
  .title {
    line-height: 40px;
    color: #616161;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 3px;
  }
  .search-box {
    width: 90vw;
    height: 40px;
    display: flex;
    justify-content: space-between;
    input {
      width: 75%;
      outline: none;
      border: 1px solid #333;
      text-indent: 15px;
    }
    .btn {
      width: 20%;
      height: 40px;
      background: #000;
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
  .list-box {
    width: 100%;
    margin: 20px 0;
    border-top: 1px solid #616161;
    .list {
      height: 40px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 1px solid #616161;
      padding: 0 5px 0 20px;
      color: #616161;
      letter-spacing: 3px;
    }
  }
  .box {
    width: 90vw;
    border: 1px solid #616161;
    border-bottom: none;
    background: #efefef;
  }
}
</style>